<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>新增商户</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<link rel="stylesheet" href="../../../../bangnuo/admin/layui/css/layui.css" media="all">
	</head>

	<body>

		<div class="layui-form" lay-filter="layuiadmin-form-useradmin" id="layuiadmin-form-useradmin" style="padding: 20px 0 0 0;">
			<div class="layui-form-item">
				<label class="layui-form-label">商户名称</label>
				<div class="layui-input-inline">
					<input type="text" name="merchantsCompanyName" lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
					<br />
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">登录名</label>
				<div class="layui-input-inline">
					<input type="text" name="merchantsUsername" lay-verify="required" placeholder="请输入商户名" autocomplete="off" class="layui-input">
					<!--<div class="layui-form-mid layui-word-red" style="color: red;">密码默认：a88888</div>-->
				</div>
				<div class="layui-form-mid layui-word-red" style="color: red;">登录名不可更改，请慎重填写</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">登录密码</label>
				<div class="layui-input-inline">
					<input type="text" name="password" lay-verify="required" placeholder="请输入登录密码" autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">负责人姓名</label>
				<div class="layui-input-inline">
					<input type="text" name="merchantsName" lay-verify="required" placeholder="请输入负责人姓名" autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">电话</label>
				<div class="layui-input-inline">
					<input type="text" name="merchantsPhone" id="merchantsPhone" lay-verify="required" placeholder="请输入手机号" autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">电子邮箱</label>
				<div class="layui-input-inline">
					<input type="text" name="merchantsEmail" id="merchantsEmail" lay-verify="required" placeholder="请输入邮箱账号" autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">支付宝账号</label>
				<div class="layui-input-inline">
					<input type="text" name="merchantsZFBUsername" lay-verify="required" placeholder="请输入支付宝账号" autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">职务</label>
				<div class="layui-input-inline">
					<input type="text" name="merchantsPosition" lay-verify="required" placeholder="请输入你的职务" autocomplete="off" class="layui-input">
				</div>
				<div class="layui-form-mid layui-word-red" style="color: red;">法人 董事长 总经理 市场经理 老板 老板娘 财务 行政 技术</div>
			</div>
			<div class="layui-form-item" lay-filter="sex">
				<label class="layui-form-label">商户类型</label>
				<div class="layui-input-block">
					<input type="radio" name="merchantsType" value="0" title="公司" checked>
					<input type="radio" name="merchantsType" value="1" title="个人">
					<input type="radio" name="merchantsType" value="2" title="个体户">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">上级代理</label>
				<div class="layui-input-block" style="width: 200px;">
					<select name="merchantsIdAgentId" id="merchantsIdAgentId">
					</select>
				</div>
			</div>

			<div class="layui-form-item">
				<label class="layui-form-label">专属业务员</label>
				<div class="layui-input-block" style="width: 200px;">
					<select name="merchantsIdAdminId" id="merchantsIdAdminId">
					</select>
				</div>
			</div>

			<div class="layui-form-item" id="area-picker">
				<div class="layui-form-label">地址</div>
				<div class="layui-input-inline" style="width: 200px;">
					<select name="merchantsProvince" class="province-selector" data-value="广东省" lay-filter="province-1">
						<option value="">请选择省</option>
					</select>
				</div>
				<div class="layui-input-inline" style="width: 200px;">
					<select name="merchantsCity" class="city-selector" data-value="深圳市" lay-filter="city-1">
						<option value="">请选择市</option>
					</select>
				</div>
				<div class="layui-input-inline" style="width: 200px;">
					<select name="merchantsArea" class="county-selector" data-value="龙岗区" lay-filter="county-1">
						<option value="">请选择区</option>
					</select>
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">详细地址</label>
				<div class="layui-input-inline">
					<input type="text" name="merchantsAddress" lay-verify="required" placeholder="请输入详细地址" autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">图片</label>
				<div class="layui-input-inline">
					<input type="hidden" name="head" lay-verify="required" id="inputimgurl" placeholder="图片地址" value="../../../bangnuo/admin/img/123.jpg" class="layui-input">
				</div>
				<div class="layui-input-inline">
					<div class="layui-upload-list" style="margin:0">
						<img style="width: 100px; height: 100px;" src="../../../bangnuo/admin/img/123.jpg" id="srcimgurl" class="layui-upload-img">
					</div>
				</div>
				<div class="layui-input-inline layui-btn-container" style="width: auto;">
					<button class="layui-btn layui-btn-primary" id="editimg">修改图片</button >
                                    </div>
                                    <div class="layui-form-mid layui-word-aux">头像的尺寸限定150x150px,大小在50kb以内</div>
                                </div>
			<div class="layui-form-item">
				<label class="layui-form-label">备注</label>
				<div class="layui-input-inline">
					<input type="text" name="agentNote" placeholder="请输入备注" autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-btn-container" style="padding-bottom: 10px; margin-left: 110px; margin-right: -110px;">
				<button class="layui-btn" lay-submit lay-filter="admin-form" data-type="close">立即提交</button>
				</div>
			</div>
	</body>
	<script src=../../../../bangnuo/admin/js/jquery-1.8.0.min.js"></script>
	<script src="../../../../bangnuo/admin/layui/layui.js"></script>
	<script>
		$("#merchantsPhone").blur(function () {
			var phone = /^[1][3,4,5,7,8][0-9]{9}$/; //"请输入正确的手机号"
			if(!phone.test($("#merchantsPhone").val())){
				layer.msg("请输入正确的电话号");
			}
		});
		$("#merchantsEmail").blur(function () {
			var email = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/; //"邮箱格式不正确"
			if(!email.test($("#merchantsEmail").val())){
				layer.msg("请输入正确的邮箱号");
			}
		});
	</script>
	<script>
		layui.use(['form', 'upload', 'layer'], function() {

			var form = layui.form;

			var resultData;
			var htmls = '<option value="">请选择</option>'; //全局变量

			//检查项目添加到下拉框中
			$.ajax({
				url: '/agentEntity/agent',
				dataType: 'json',
				type: 'get',
				success: function(data) {
					resultData = data.queryResult.list;                       
					for(var x in resultData) {                            
						htmls += '<option value = "' + resultData[x].id + '">' + resultData[x].name + '</option>';                      
					} 
					$("#merchantsIdAgentId").html(htmls);
					form.render('select');
					//重新渲染 固定写法
				}
			})
		});
	</script>
	<script>
		layui.use(['form', 'upload', 'layer'], function() {

			var form = layui.form;

			var resultData;
			var htmls = '<option value="">请选择</option>'; //全局变量

			//检查项目添加到下拉框中
			$.ajax({
				url: 'http://192.168.101.93:2601/adminEntity/admin',
				dataType: 'json',
				type: 'get',
				success: function(data) {
					resultData = data.data;                       
					for(var x in resultData) {                            
						htmls += '<option value = "' + resultData[x].value + '">' + resultData[x].name + '</option>';                      
					} 
					$("#merchantsIdAdminId").html(htmls);
					form.render('select');
					//重新渲染 固定写法
				}
			})
		});
	</script>
	<script>
		//配置插件目录
		layui.config({
			base: '../../../bangnuo/admin/',
			version: '1.0'
		});
		//一般直接写在一个js文件中
		layui.use(['layer', 'form', 'layarea'], function() {
			var layer = layui.layer,
				form = layui.form,
				layarea = layui.layarea;

			layarea.render({
				elem: '#area-picker',
				change: function(res) {
					//选择结果
					console.log(res);
				}
			});
		});
	</script>
	<!--加载表单组件样式-->
	<script>
		layui.config({
			base: '../../../bangnuo/admin/' //静态资源所在路径
		}).extend({
			index: 'lib/index' //主入口模块
		}).use(['index', 'form', 'upload'], function() {
			var $ = layui.$,
				form = layui.form,
				upload = layui.upload;

			upload.render({
				elem: '#layuiadmin-upload-useradmin',
				url: layui.setter.base + 'json/upload/demo.js',
				accept: 'images',
				method: 'get',
				acceptMime: 'image/*',
				done: function(res) {
					$(this.item).prev("div").children("input").val(res.data.src)
				}
			});
		})
	</script>

	<!--获取表单信息，提交表单-->
	<script type="text/javascript">
		layui.use('form', function() {
			var form = layui.form;
			//监听提交
			form.on('submit(admin-form)', function(data) {
				$.ajax({
					type: "POST",
					url: "/merchantsEntity/addMerchants",
					contentType: "application/json;charset=UTF-8",
					data: JSON.stringify(data.field),
					async: true,
					success: function(data) {
						if(data.success == true) {
							layer.msg(data.message);
							window.location.reload();
						} else {
							layer.msg(data.message);
						}
					}
				});
				return false;
			});
		});
	</script>
	<script>
		layui.config({
			base: '../../../bangnuo/admin/cropper/' //layui自定义layui组件目录
		}).use(['form', 'croppers'], function() {
			var $ = layui.jquery,
				form = layui.form,
				croppers = layui.croppers,
				layer = layui.layer;

			//创建一个头像上传组件
			croppers.render({
				elem: '#editimg',
				saveW: 150 //保存宽度
					,
				saveH: 150,
				mark: 1 / 1 
					,//选取比例
				area: '900px' //弹窗宽度
					,
				url: "upload/uploadImg" //图片上传接口返回和（layui 的upload 模块）返回的JOSN一样
					,
				done: function(url) { //上传完毕回调
					$("#inputimgurl").val(url);
					$("#srcimgurl").attr('src', url);
				}
			});
		});
	</script>

</html>